<template>
	<div class="publicpageview" style="background-color: #fff;">

		<div class="tab1-demo-topTab">
			<scrollable-tabs :tabs="tabs" :max-visible-tabs="4" v-model="activeTab" @tab-click="handleTabClick">
				<!-- 自定义标签内容 -->
				<template v-slot:tab="{ tab, index }">
					<div class="custom-tab">
						{{ tab.name }}
					</div>
				</template>
			</scrollable-tabs>
			<div class="tab1-demo-topTab-btn">
				<el-button type="primary" @click="gotoSuo" size="medium">所资料</el-button>
				<el-button type="primary" @click='gotoShoujiao' size="medium">收租</el-button>
			</div>
		</div>
		<div v-if="activeTab==0" class="tab1-demo-ruleForm">
			<el-form :rules='rules' :model="addQuery" ref="addForm" class="demo-ruleForm" label-position="right">
				<div class="addForm-row">
					<div class="addForm-col">
						<el-form-item label="管片：" prop="blockgroup" label-width="150px">
							<el-select :disabled="isDis" v-model="addQuery.blockgroup">
								<div v-for="(item,index) in gpList" :key="index">
									<el-option :label="item.groupnew" :value="item.groupnew" :key="index"></el-option>
								</div>
							</el-select>
							<el-tooltip class="item" effect="dark" content="增加新纪录时，先选择“管片”，然后选择“所号”，系统自动调入“地址”、“产别”、“性质”"
								placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="所号：" prop="blockno" label-width="150px">
							<el-select :disabled="isDis" v-model="addQuery.blockno" @change="blListChange" value-key="blockno">
								<div v-for="(item,index) in blList" :key="index">
									<el-option :label="item.blockno" :value="item" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="门号：" prop="buildingdoorno" label-width="150px">
							<el-input :disabled="isDis" v-model="addQuery.buildingdoorno"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="户序：" prop="rentcountno" label-width="150px">
							<el-input :disabled="isDis" v-model="addQuery.rentcountno"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="机器编号：" prop="renterid" label-width="150px">
							<el-input disabled v-model="addQuery.renterid"></el-input>
							<el-tooltip class="item" effect="dark" content="Renter表的自动编号" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="地址：" prop="address" label-width="150px">
							<el-input disabled v-model="addQuery.address"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="管理形式：" prop="manageway" label-width="150px">
							<el-select :disabled="isDis" v-model="addQuery.manageway" placeholder="全部">
								<el-option label="正常" value="正常"></el-option>
								<el-option label="新纳入" value="新纳入"></el-option>
								<el-option label="托管房屋" value="托管房屋"></el-option>
							</el-select>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="产别：" prop="ownway" label-width="150px">
							<el-select :disabled="isDis" v-model="addQuery.ownway" disabled>
								<div v-for="(item,index) in chanbieList" :key="index">
									<el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="居室间号：" prop="roomno" label-width="150px">
							<el-input disabled v-model="addQuery.roomno"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="居室间数：" prop="roomcount" label-width="150px">
							<el-input disabled v-model="addQuery.roomcount"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" style="width: 640px;">
						<el-form-item label="合同编号：" prop="contractid" label-width="150px">
							<div class="hetongClass" style="width: 490px;display: flex;box-sizing: border-box;padding-right: 220px;">
								<el-input :disabled="isDis" v-model="addQuery.contractid"></el-input>

								<el-tooltip class="item" effect="dark" content="15位，组成方式：房管站的4位编号 + 所号的后四位数字 + 四位的门号 + 三位的户序号，
								其中门号和户序号不足位的左侧补零。
								如新增合同编号与当前库中没有终止的合同编号重复，不准生成，提示此合同编号已存在" placement="top">
									<i class="el-icon-warning" style="margin-left:45px"></i>
								</el-tooltip>
								<el-button :disabled="isDis" style="margin-left: 10px;" size="mini" type="primary"
									@click="createcID">生成</el-button>
							</div>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="可售：" prop="issell" label-width="150px">
							<el-select :disabled="isDis" v-model="addQuery.issell">
								<el-option label="可售" value="可售"></el-option>
								<el-option label="不可售" value="不可售"></el-option>
							</el-select>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="承租人：" prop="renter" label-width="150px">
							<el-input :disabled="isDis" v-model="addQuery.renter"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="证件类型：" label-width="150px" prop="certificatetype">
							<el-select :disabled="isDis" v-model="addQuery.certificatetype">
								<div v-for="(item,index) in shenfenList" :key="index">
									<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
								</div>
							</el-select>


						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="证件号码：" prop="renteridno" label-width="150px">
							<el-input :disabled="isDis" v-model="addQuery.renteridno"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="自然间数(独)：" prop="singleuseroomscount" label-width="150px">
							<el-input disabled v-model="addQuery.singleuseroomscount"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="自然间数(伙)：" prop="shareroomscount" label-width="150px">
							<el-input disabled v-model="addQuery.shareroomscount"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="计租面积(独)：" prop="singleusearea" label-width="150px">
							<el-input disabled v-model="addQuery.singleusearea"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="计租面积(伙)：" prop="sharearea" label-width="150px">
							<el-input disabled v-model="addQuery.sharearea"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="性质：" prop="livingway" label-width="150px">
							<el-select disabled v-model="addQuery.livingway">
								<el-option label="住宅" value="住宅"></el-option>
								<el-option label="非住宅" value="非住宅"></el-option>
							</el-select>
							<el-tooltip class="item" effect="dark"
								content="选择“非住宅”时，显示“用途”、“使用”、“基本”、“暖气”、“电梯”、“超高”输入项；选择“住宅”时，则没有上述输入项" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="基本：" prop="basicrent" label-width="150px">
							<el-input v-model="addQuery.basicrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="电梯：" prop="elevatorrent" label-width="150px">
							<el-input v-model="addQuery.elevatorrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="暖气：" prop="heatrent" label-width="150px">
							<el-input v-model="addQuery.heatrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="使用：" prop="usingarea" label-width="150px">
							<el-input v-model="addQuery.usingarea"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="租金类别：" prop="rentway" label-width="150px">
							<el-input v-model="addQuery.rentway"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="超高：" prop="overheightrent" label-width="150px">
							<el-input v-model="addQuery.overheightrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="增值税：" prop="zzs" label-width="150px">
							<el-input v-model="addQuery.zzs"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col" v-if="addQuery.livingway=='非住宅'">
						<el-form-item label="不含税租金：" prop="bhs" label-width="150px">
							<el-input v-model="addQuery.bhs"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="摊后计租面积：" prop="afterarea" label-width="150px">
							<el-input disabled v-model="addQuery.afterarea"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="租定金额：" prop="monthrent" label-width="150px">
							<el-input disabled v-model="addQuery.monthrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="月实应收：" prop="realrent" label-width="150px">
							<el-input disabled v-model="addQuery.realrent"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="订约日期：" prop="startsigndate" label-width="150px">
							<el-date-picker :disabled="isDis" v-model="addQuery.startsigndate" type="date" placeholder="年/月/日">
							</el-date-picker>
							<el-tooltip class="item" effect="dark" content="yyyy-m-d形式，4位年份" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="起租日期：" label-width="150px" prop="startrentdate">
							<el-date-picker :disabled="isDis" v-model="addQuery.startrentdate" type="date" placeholder="年/月/日">
							</el-date-picker>
							<el-tooltip class="item" effect="dark" content="yyyy-m-d形式，4位年份" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="减免：" label-width="150px" prop="discountreason">
							<el-select :disabled="isDis" v-model="addQuery.singleuseflag">
								<div v-for="(item,index) in jianmianList" :key="index">
									<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</div>

					<div class="addForm-col">
						<el-form-item label="核减原因：" label-width="150px" prop="discountreason">
							<el-select :disabled="isDis" v-model="addQuery.discountreason">
								<div v-for="(item,index) in hejianyuanyingList" :key="index">
									<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="减租：" label-width="150px" prop="rentdiscount">
							<el-input :disabled="blocktype!=2" v-model="addQuery.rentdiscount"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="退约日期：" label-width="150px" prop="stopsigndate">
							<el-date-picker :disabled="isDis" v-model="addQuery.stopsigndate" type="date" placeholder="年/月/日">
							</el-date-picker>
							<el-tooltip class="item" effect="dark" content="默认为空，数据库字段的值为null，如果输入了值，则表示该户终止了" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="停租日期：" label-width="150px" prop="stoprentdate">
							<el-date-picker :disabled="isDis" v-model="addQuery.stoprentdate" type="date" placeholder="年/月/日">
							</el-date-picker>
							<el-tooltip class="item" effect="dark" content="默认为空，数据库字段的值为null，如果输入了值，则表示该户终止了" placement="top">
								<i class="el-icon-warning" style="margin-left:5px"></i>
							</el-tooltip>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="违约金额：" label-width="150px" prop="rentDiscount1">
							<el-input :disabled="isDis" v-model="addQuery.rentDiscount1"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="盈亏：" label-width="150px" prop="profitloss">
							<el-input disabled v-model="addQuery.profitloss"></el-input>
						</el-form-item>
					</div>
					<div class="addForm-col">
						<el-form-item label="手机号码：" label-width="180px" prop="mobile">
							<el-input :disabled="isDis" v-model="addQuery.mobile"></el-input>
						</el-form-item>
					</div>
				<!-- 	<el-form-item label="成套：" prop="singleuseflag">
						<el-select v-model="addQuery.singleuseflag">
							<el-option label="成套" value="成套" key="1"></el-option>
							<el-option label="非成套" value="非成套" key="0"></el-option>
						</el-select>
					</el-form-item> -->
				</div>

			</el-form>
		</div>
		<div v-if="activeTab==1">
			<!-- 档案录入变动情况 -->
			<el-table :data="qinkuangList" border max-height='500px'>
				<el-table-column prop="changedate" label="日期">

					<template slot-scope="scope">
						{{scope.row.changedate?scope.row.changedate.split(' ')[0]:''}}
					</template>
				</el-table-column>
				<el-table-column prop="startyearmonth" label="起始年月">
				</el-table-column>
				<el-table-column prop="stopyearmonth" label="终止年月">
				</el-table-column>
				<el-table-column prop="runnotway" label="是否经营">
				</el-table-column>
				<el-table-column prop="runway" label="未经营类别">
				</el-table-column>
				<el-table-column prop="runnotwaydetail" label="未经营类别明细">
				</el-table-column>
				<el-table-column prop="collectway" label="收租方式">
				</el-table-column>
				<!-- <el-table-column label="操作" width="100">
					<template slot-scope="scope">
						<el-button @click="handleClick(scope.row)" type="text" size="small">修改</el-button>
						<el-button type="text" size="small" @click="delectbd">删除</el-button>
					</template>
				</el-table-column> -->
			</el-table>
		</div>
		<div v-if="activeTab==2">
			<!-- 档案录入变动依据 -->
			<el-table :data="yijuList" border max-height='500px'>
				<el-table-column prop="changedate" label="日期">
					<template slot-scope="scope">
						{{scope.row.changedate?scope.row.changedate.split(' ')[0]:''}}
					</template>
				</el-table-column>
				<el-table-column prop="changeclass" label="类别">
				</el-table-column>
				<el-table-column prop="changecause" label="依据">
				</el-table-column>
				<el-table-column prop="changememo1" label="备注">
				</el-table-column>
				<!-- <el-table-column label="操作" width="100">
					<template slot-scope="scope">
						<el-button @click="handleClick(scope.row)" type="text" size="small">修改</el-button>
						<el-button type="text" size="small" @click="delectbd">删除</el-button>
					</template>
				</el-table-column> -->
			</el-table>
		</div>
		<div v-if="activeTab==3">
			录入房间情况
		</div>
		<div v-if="activeTab==4">
			历史租金情况
		</div>
		<div v-if="activeTab==5">
			违约金情况
		</div>
		<div v-if="activeTab==6">
			租凭合同打印历史
		</div>
		<div v-if="activeTab==7">
			租凭合同图像上传
		</div>
		<div v-if="activeTab==8">
			未经营原始凭证上传
		</div>
		<div class="demo-ruleForm-footerbtn">
			<el-button type="primary" @click="lurufangjianqingkuang" size="medium">录入房间情况</el-button>
			<el-button type="primary" @click="lurulishizujin" size="medium">历史租金情况</el-button>
			<el-button type="primary" size="medium" @click="openWeiyue">违约金情况</el-button>
			<el-dropdown>
				<el-button type="primary" size="medium">
					更多<i class="el-icon-arrow-down el-icon--right"></i>
				</el-button>
				<el-dropdown-menu slot="dropdown">
					<el-dropdown-item @click.native="dayin">租凭合同打印历史</el-dropdown-item>
					<el-dropdown-item @click.native="zuyongDayin">租用住房基本情况打印</el-dropdown-item>
					<el-dropdown-item @click.native="shebeiDayin">住房装修设备打印</el-dropdown-item>
					<el-dropdown-item>租凭合同图像上传</el-dropdown-item>
					<el-dropdown-item>未经营原始凭证上传</el-dropdown-item>
				</el-dropdown-menu>
			</el-dropdown>
			<el-button v-if="blocktype!=1" type="primary" @click="save" size="medium">保 存</el-button>
			<el-button type="primary" @click="returns" size="medium">返回</el-button>
		</div>


		<el-dialog append-to-body v-if='isWeiyue' title="违约金" :visible.sync="isWeiyue" width="80%"
			:before-close="handleClose" style="margin-top: 70px;">
			<el-button style="margin-bottom:10px;" type="primary" size="mini" @click="handleAddWeiyue">录入</el-button>
			<el-table :data="weiyueList" border style="width: 100%;" max-height='500px'>
				<el-table-column prop="penaltyTime" label="年月" width="350">
				</el-table-column>
				<el-table-column prop="penalty" label="违约金" width="450">
				</el-table-column>
				<el-table-column prop="remake" label="备注" width="450">
				</el-table-column>
				<el-table-column fixed="right" label="操作" width="100">
					<template slot-scope="scope">
						<el-button @click="detailWeiyue(scope.row)" type="text" size="small">修改</el-button>
						<!-- <el-button type="text" size="small" @click="delectbd">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<div class="saveContent">
				<el-button type="primary" @click="weiyueJieqing" size="medium">确定结清</el-button>
			</div>
		</el-dialog>

		<el-dialog append-to-body v-if='WeiyueLuru' :title="weiyueName" :visible.sync="WeiyueLuru" width="40%"
			:before-close="handleClose" style="margin-top: 70px;">
			<el-form :rules='weiyueRule' :model="weiyueQuery" ref="weiyueForm" class="demo-ruleForm luruClass"
				label-position="right" label-width="170px">
				<el-form-item label="违约金：" prop="penalty">
					<el-input v-model.number="weiyueQuery.penalty"></el-input>
				</el-form-item>
				<el-form-item label="年月：" prop="penaltyTime">
					<el-date-picker v-model="weiyueQuery.penaltyTime" type="date" placeholder="选择日期时间" align="right">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="备注：" prop="remake">
					<el-input v-model.number="weiyueQuery.remake"></el-input>
				</el-form-item>
			</el-form>

			<div class="saveContent">
				<el-button type="primary" @click="weiyueSave" size="medium">保 存</el-button>
			</div>
		</el-dialog>

		<fangjianluru v-if="fangjianShow" @fangjianClose="fangjianClose" :fangjianShow='fangjianShow' :rentId='rentId'
			:blockno='addQuery.blockno'></fangjianluru>
		<lishizujinluru v-if="lishiShow" @lishiClose="lishiShow = false" :lishiShow='lishiShow' :rentId='rentId'
			:blockno='addQuery.blockno'></lishizujinluru>
	</div>
</template>

<script>
	import dayjs from 'dayjs'
	import {
		getArea,
		getHouseAdmin,
		blockGroupList,
		blockList,
		blockDetail
	} from '@/api/industry'
	import {
		rentList,
		addRenter,
		createCID,
		renterPenaltyList,
		addRenterPenalty,
		updRenterPenalty,
		settleRenterPenalty,
		getRent,
		renterChangePage,
		renterRunWayPage,
		updRenterData
	} from '@/api/management'
	import ScrollableTabs from '@/components/ScrollableTabs.vue'
	import fangjianluru from './fangjianluru.vue'
	import lishizujinluru from './lishizujinluru.vue'
	export default {
		name: 'Chengzuhudangan',
		components: {
			ScrollableTabs,
			fangjianluru,
			lishizujinluru
		},
		data() {
			return {
				tabs: [{
						name: '基本信息'
					},
					{
						name: '录入档案变动情况'
					},
					{
						name: '录入档案变动依据'
					}
				],
				activeTab: 0,
				listQuery: {
					pageNum: 1,
					pageSize: 20,
					areaUnit: '',
					houseAdmin: '',
					address: '',
					BlockGroup: '',
					BlockNo: '',
					BuildingDoorNo: '',
					ContractID: '',
					issell: '',
					DID: '',
					LivingWay: '',
					ManageWay: '',
					OwnWay: '',
					Renter: '',
					RenterIDNo: '',
					RunWay: '',
					StartSignDate: ''
				},
				addQuery: {
					certificatetype: '',
					blockgroup: '',
					blockno: '',
					buildingdoorno: '',
					rentcountno: '',
					renterid: '',
					address: '',
					manageway: '',
					ownway: '',
					roomno: '',
					roomcount: '',
					contractid: '',
					singleuseflag: '',
					issell: '',
					renter: '',
					renteridno: '',
					singleuseroomscount: '',
					shareroomscount: '',
					singleusearea: '',
					sharearea: '',
					livingway: '',
					afterarea: '',
					monthrent: '',
					realrent: '',
					startsigndate: '',
					startrentdate: '',
					discountreason: '',
					rentdiscount: '',
					stopsigndate: '',
					stoprentdate: '',
					rentDiscount1: '',
					profitloss: '',
					mobile: '',
					jiben:'',
					elevatorrent:'',
					heatrent:'',
					usingarea:'',
					rentway:'',
					overheightrent:'',
					basicrent:'',
					bhs:'',
					zzs:''
				},
				newAddList: {},
				rules: {
					blockgroup: [{
						required: true,
						message: '请选择管片',
						trigger: 'blur'
					}],
					blockno: [{
						required: true,
						message: '请选择所号',
						trigger: 'blur'
					}],
					buildingdoorno: [{
						required: true,
						message: '请输入门号',
						trigger: 'blur'
					}],
					rentcountno: [{
						required: true,
						message: '请输入户序',
						trigger: 'blur'
					}],
					address: [{
						required: true,
						message: '请输入地址',
						trigger: 'blur'
					}],
					manageway: [{
						required: true,
						message: '请输入管理形式',
						trigger: 'blur'
					}],
					ownway: [{
						required: true,
						message: '请选择产别',
						trigger: 'blur'
					}],
					contractid: [{
						required: true,
						message: '请输入/生成合同编号',
						trigger: 'blur'
					}],
					singleuseflag: [{
						required: true,
						message: '请选择成套',
						trigger: 'blur'
					}],
					issell: [{
						required: true,
						message: '请选择可售',
						trigger: 'blur'
					}],
					renter: [{
						required: true,
						message: '请输入承租人',
						trigger: 'blur'
					}],
					renteridno: [{
						required: true,
						message: '请输入证件号码',
						trigger: 'blur'
					}],

					certificatetype: [{
						required: true,
						message: '请选择证件类型',
						trigger: 'blur'
					}],
					startsigndate: [{
						required: true,
						message: '请选择订约日期',
						trigger: 'blur'
					}],
					startrentdate: [{
						required: true,
						message: '请选择起租日期',
						trigger: 'blur'
					}]
				},
				total: 0,
				list: [],
				listLoading: false,
				dialogVisible: false,
				tenantDetail: {},
				// 区房屋管理单位
				areaList: [],
				// 根据区获取部门
				HouseList: [],
				// 管片列表
				gpList: [],
				isSearch: false,
				luruVisible: false,
				blList: [],

				tableData: [],
				rentId: '',
				// 产别
				chanbieList: [],
				chanyeList: [],
				shenfenList: [],
				jianmianList: [],
				hejianyuanyingList: [],
				typeName: '',
				weiyueQuery: {
					penalty: '',
					penaltyTime: '',
					remake: '',
					status: 0
				},
				isWeiyue: false,
				weiyueList: [],
				WeiyueLuru: false,
				weiyueRule: {
					penalty: [{
						required: true,
						message: '请输入违约金',
						trigger: 'blur'
					}],
					penaltyTime: [{
						required: true,
						message: '请选择时间',
						trigger: 'blur'
					}],
					remake: [{
						required: true,
						message: '请输入备注',
						trigger: 'blur'
					}],
				},
				weiyueName: '',
				blockid: '',
				fangjianShow: false,
				lishiShow: false,
				// 变动依据
				yijuList: [],
				// 变动情况
				qinkuangList: [],
				isDis: false,
				blocktype:''
			}
		},

		mounted() {
			if (this.$route.query.addQuery) {
				this.blockid = this.$route.query.blockid
				this.rentId = this.$route.query.rentId
				this.addQuery = JSON.parse(this.$route.query.addQuery)
				// this.hejianChange(this.addQuery.discountreason)
				this.blocktype = this.$route.query.blocktype
				this.isDis = this.blocktype==1?true:false
			}

			// 遍历字典
			this.chanyeList = JSON.parse(localStorage.getItem('jinying'))
			this.chanyeList.forEach((item, index) => {
				if (item.classname == '产别') {
					item.classmidList.forEach((it, idx) => {
						if (it.classmid == '产别') {
							this.chanbieList = it.classdetailList
						}
					})
				} else if (item.classname == '证件类型') {
					this.shenfenList = item.classmidList
				} else if (item.classname == '减免') {
					this.jianmianList = item.classmidList
				} else if (item.classname == '减核原因') {
					this.hejianyuanyingList = item.classmidList
				}
			})

			this.getArea()



			this.newAddList = JSON.stringify(this.addQuery)
		},

		methods: {
			// 获取信息
			getRent() {
				let data = {
					cid: this.addQuery.contractid
				}
				getRent(data).then(res => {
					console.log(res)
					this.addQuery.roomno = res.data.roomno
					this.addQuery.roomcount = res.data.roomcount
					this.addQuery.singleuseroomscount = res.data.singleuseroomscount
					this.addQuery.shareroomscount = res.data.shareroomscount
					this.addQuery.singleusearea = res.data.singleusearea
					this.addQuery.sharearea = res.data.sharearea
					this.addQuery.livingway = res.data.block.livingway
					this.addQuery.afterarea = res.data.afterarea
					this.addQuery.monthrent = res.data.monthrent
					this.addQuery.rentdiscount = res.data.rentdiscount
					this.addQuery.realrent = res.data.realrent
					this.addQuery.profitloss = res.data.profitloss
					this.addQuery.mobile = res.data.mobile

					// this.addQuery.realrent = res.data.monthrent - res.data.rentdiscount
					// this.hejianChange(res.data.discountreason)
				})
			},
			hejianChange(e) {
				this.hejianyuanyingList.forEach((item, index) => {
					if (e == item.classmid) {
						item.classdetailList.forEach((it, idx) => {
							if (this.addQuery.monthrent) {
								this.addQuery.rentdiscount = it.value * this.addQuery.monthrent
								this.addQuery.realrent = this.addQuery.monthrent - this.addQuery.rentdiscount
							} else {
								this.addQuery.rentdiscount = 0
								this.addQuery.realrent = 0
							}
						})
					}
				})
			},
			createcID() {
				if (this.addQuery.buildingdoorno == '') {
					this.$message({
						type: 'success',
						message: '请输入门号'
					})
				} else if (this.addQuery.blockno == '') {
					this.$message({
						type: 'success',
						message: '请输入所号'
					})
				} else if (this.addQuery.rentcountno == '') {
					this.$message({
						type: 'success',
						message: '请输入户序'
					})
				} else {
					let data = {
						buildingdoorno: this.addQuery.buildingdoorno,
						blockno: this.addQuery.blockno,
						RentCountNo: this.addQuery.rentcountno
					}
					createCID(data).then(res => {
						this.addQuery.contractid = res.data
					})
				}

			},
			blockList() {
				let data = {
					limit: 99999,
					page: 1
				}
				blockList(data).then((res) => {
					this.blList = res.data.list
				})
			},
			blListChange(e) {
				this.blockid = e.blockid
				this.addQuery.blockno = e.blockno
				let data = {
					BlockID: e.blockid
				}
				blockDetail(data).then(res => {
					this.addQuery.address = res.data.address
					this.addQuery.ownway = res.data.ownway
					this.addQuery.livingway = res.data.livingway
				})
			},
			getArea() {
				getArea().then((res) => {
					console.log(res)
					this.areaList = res.data

					this.blockGroupList()
					this.rentList()
					this.blockList()
					if (this.addQuery.contractid) {
						this.getRent()
					}

				})
			},
			getHouseAdmin(e) {
				getHouseAdmin({
					DID: e
				}).then((res) => {
					this.HouseList = res.data
				})
			},
			// 选择区房屋管理
			areaChange(e) {
				console.log(e)
				this.listQuery.areaUnit = e
				this.listQuery.houseAdmin = ''
				this.getHouseAdmin(e)
			},
			// 根据区获取部门
			HouseChange(e) {
				console.log(e)
				this.listQuery.houseAdmin = e
			},
			//管片
			gpChange(e) {
				this.listQuery.BlockGroup = e
			},
			handleSizeChange(val) {
				this.listQuery.pageNum = 1
				this.listQuery.pageSize = val
				this.rentList()
			},
			// 管片列表
			blockGroupList() {
				let data = {
					pageNum: 1,
					pageSize: 9999999
				}
				this.listLoading = true
				blockGroupList(data).then((res) => {
					this.gpList = res.data.list
					this.listLoading = false
				})
			},
			handleCurrentChange(val) {
				this.listQuery.pageNum = val
				this.rentList()
			},
			// 搜索
			handleSearch() {
				this.rentList()
			},
			rentList() {
				let data = this.listQuery
				data.StartSignDate = data.StartSignDate ?
					dayjs(data.StartSignDate).format('YYYY-MM-DD HH:mm:ss') :
					''
				data.aid = data.houseAdmin
				rentList(data).then((res) => {
					console.log(res)
					this.list = res.data.list
					this.total = res.data.total
				})
			},
			// 重置表单
			resetForm(formName) {
				this.$refs[formName].resetFields()
			},
			// 弹窗关闭
			handleDialogClose() {
				this.tenantDetail = {}
			},
			// 查看附件
			viewAttachment() {
				this.$message.info('查看附件功能待开发')
			},
			handleAddUser() {
				this.luruVisible = true
				this.typeName = '档案录入'
			},
			handleClose(done) {
				this.$confirm('确认关闭？')
					.then((_) => {
						done()
						this.addQuery = JSON.parse(this.newAddList)

						this.rester()
					})
					.catch((_) => {})
			},
			save() {
				if(this.addQuery.buildingdoorno.length==4&&this.addQuery.rentcountno.length==3){
					this.$refs.addForm.validate((valid) => {
						if (valid) {
							let data = this.addQuery
							data.startsigndate = dayjs(data.startsigndate).format(
								'YYYY-MM-DD HH:mm:ss'
							)
							data.startrentdate = dayjs(data.startrentdate).format(
								'YYYY-MM-DD HH:mm:ss'
							)
							data.stopsigndate = data.stopsigndate ? dayjs(data.stopsigndate).format(
								'YYYY-MM-DD HH:mm:ss'
							) : ''
							data.stoprentdate = data.stoprentdate ? dayjs(data.stoprentdate).format(
								'YYYY-MM-DD HH:mm:ss'
							) : ''
							if(this.blocktype==2){
								updRenterData(data).then((res) => {
									console.log(res)
									this.$message({
										type: 'success',
										message: '操作成功!'
									})
									this.rentList()
									this.rentId = res.data.renterid
								})
							}else{
								addRenter(data).then((res) => {
									console.log(res)
									this.$message({
										type: 'success',
										message: '操作成功!'
									})
									this.rentList()
									this.rentId = res.data.renterid
								})
							}
							
						} else {
							console.log('验证失败！')
							return false
						}
					})
				}else{
					this.$message({
						type: 'success',
						message: '请输入4位门号和3位户序'
					})
				}
				
			},
			returns() {
				this.$router.go(-1)
			},
			// 弹窗内容删除
			delectbd() {
				this.$confirm('此操作将删除该条内容，请确认是否继续操作？', '删除提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					})
					.then(() => {
						this.$message({
							type: 'success',
							message: '删除成功!'
						})
					})
					.catch(() => {
						this.$message({
							type: 'info',
							message: '已取消删除'
						})
					})
			},
			gotoSuo() {
				if (this.addQuery.blockno) {
					const route = this.$router.resolve({
						path: '/industry/chanyeziliao/suoziliaoluru',
						query: {
							blockno: this.addQuery.blockno,
							type: 3,
							blockid: this.blockid
						}
					})
					window.open(route.href, '_blank')
				} else {
					this.$message({
						type: 'success',
						message: '请选择所号'
					})
				}
			},
			gotoShoujiao() {
				if (this.rentId) {
					const route = this.$router.resolve({
						path: '/management/zujinguanli/zujinshoujiao',
						query: {
							contractid: this.addQuery.contractid
						}
					})
					window.open(route.href, '_blank')
				} else {
					this.$message({
						type: 'success',
						message: '请先保存'
					})
				}
			},

			lurufangjianqingkuang() {
				if (this.rentId) {
					this.fangjianShow = true
				} else {
					this.$message({
						type: 'success',
						message: '请先保存信息'
					})
				}
			},
			lurulishizujin() {
				if (this.rentId) {
					this.lishiShow = true
				} else {
					this.$message({
						type: 'success',
						message: '请先保存信息'
					})
				}
			},
			openWeiyue() {
				if (this.rentId) {
					this.isWeiyue = true
					let data = {
						rentId: this.rentId
					}
					renterPenaltyList(data).then(res => {
						console.log(res)
						this.weiyueList = res.data
					})
				} else {
					this.$message({
						type: 'success',
						message: '请先保存信息'
					})
				}

			},
			handleAddWeiyue() {
				this.WeiyueLuru = true
				this.weiyueName = '添加'
			},
			weiyueSave() {
				this.$refs.weiyueForm.validate((valid) => {
					if (valid) {
						let data = this.weiyueQuery
						data.penaltyTime = dayjs(data.penaltyTime).format('YYYY-MM')
						data.renterId = this.rentId
						if (this.weiyueName == '添加') {
							addRenterPenalty(data).then(res => {
								console.log(res)
								this.$message({
									type: 'success',
									message: '操作成功!'
								})
								this.WeiyueLuru = false
								this.openWeiyue()
							})
						} else {
							updRenterPenalty(data).then(res => {
								console.log(res)
								this.$message({
									type: 'success',
									message: '操作成功!'
								})
								this.WeiyueLuru = false
								this.openWeiyue()
							})
						}

					} else {
						console.log('验证失败！')
						return false
					}
				})
			},
			detailWeiyue(e) {
				this.weiyueQuery = e
				this.weiyueName = '修改'
				this.WeiyueLuru = true
			},
			weiyueJieqing() {
				this.$confirm('此操作将结清违约金，请确认是否继续操作？', '结清提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					})
					.then(() => {
						let data = {
							rentId: this.rentId
						}
						settleRenterPenalty(data).then(res => {
							this.$message({
								type: 'success',
								message: '操作成功!'
							})
							this.openWeiyue()
						})
					})
					.catch(() => {
						this.$message({
							type: 'info',
							message: '已取消操作'
						})
					})
			},
			// handleTabChange(index) {
			//   console.log('标签改变:', index)
			//   this.activeName = index
			// },
			handleTabClick(index) {
				this.activeTab = index
				if (this.rentId) {
					if (index == 1) {
						let data = {
							pageNum: 1,
							pageSize: 999999,
							renterId: this.rentId
						}
						renterRunWayPage(data).then(res => {
							this.qinkuangList = res.data.list

						})
					} else if (index == 2) {
						let data = {
							pageNum: 1,
							pageSize: 999999,
							renterId: this.rentId
						}
						renterChangePage(data).then(res => {
							this.yijuList = res.data.list
						})
					}
				}

			},
			fangjianClose() {
				this.fangjianShow = false
				this.getRent()
			},
			handleClick() {},
			dayin() {
				this.$router.push({
					path: 'gongyouzufang',
					query: {
						addQuery: JSON.stringify(this.addQuery)
					}
				})
			},
			zuyongDayin() {
				this.$router.push({
					path: 'zhuyongzufang',
					query: {
						addQuery: JSON.stringify(this.addQuery),
						rentId:this.rentId
					}
				})
			},
			shebeiDayin() {
				this.$router.push({
					path: 'zhuangxiushebei',
					query: {
						addQuery: JSON.stringify(this.addQuery)
					}
				})
			}
		}
	}
</script>

<style scoped>
	/* 页面样式继承公共样式类 publicpageview, publicformview, publitableview */

	/* 详情弹窗样式 */
	.tenant-detail {
		padding: 20px;
	}

	.section-title {
		margin: 20px 0 15px 0;
		font-size: 16px;
		font-weight: 500;
		color: #409eff;
		border-left: 4px solid #409eff;
		padding-left: 10px;
	}

	.section-title:first-child {
		margin-top: 0;
	}

	.info-row {
		margin-bottom: 15px;
	}

	.info-item {
		display: flex;
		align-items: center;
		padding: 8px 0;
		min-height: 25px;
	}

	.info-item label {
		min-width: 80px;
		font-weight: 500;
		color: #606266;
		margin-right: 10px;
		text-align: right;
		min-height: 25px;
	}

	.info-item span {
		color: #303133;
		background-color: #f5f7fa;
		padding: 4px 8px;
		border-radius: 4px;
		flex: 1;
		min-height: 25px;
	}

	.dialog-footer {
		text-align: center;
		padding-top: 20px;
	}

	/deep/.el-input__inner {
		width: 160px;
	}

	/deep/.publicpaginationview .el-input__inner {
		width: 100px;
	}

	/deep/.publicpaginationview .is-in-pagination .el-input__inner {
		width: 50px;
	}

	/deep/.el-dialog__body {
		padding: 0 20px;
	}

	.saveContents {
		width: 100%;
		display: flex;
		margin-top: 20px;
		padding-bottom: 20px;
		justify-content: end;
	}

	.saveContent {
		width: 100%;
		display: flex;
		margin-top: 20px;
		padding-bottom: 20px;
		justify-content: end;
	}

	.contents {
		width: 85%;
		display: flex;
		align-items: center;
		justify-content: start;
		flex-wrap: wrap;

		button {
			margin-bottom: 10px;
			margin-left: 10px;
		}
	}

	.demo-ruleForm {
		padding-top: 20px;
	}

	.demo-ruleForm-footerbtn {
		text-align: right;
		padding: 20px 0;
	}

	.tab1-demo-ruleForm {
		/* height: 60vh; */
		background-color: #fff
	}

	.addForm-row {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		width: 1400px;
	}
	.addForm-col{
		width: 350px;
	}

	/deep/ .el-dropdown {
		margin: 0 10px;
	}

	.tab1-demo-topTab {
		position: relative;
	}

	.tab1-demo-topTab-btn {
		position: absolute;
		top: 5px;
		right: 10px;
	}

	/deep/ .luruClass .el-input__inner {
		width: 300px;
	}

	/deep/ .el-select {
		width: 160px
	}

	/deep/ .el-input {
		width: 160px
	}

	/deep/ .hetongClass .el-input__inner {
		width: 200px;
	}
</style>